<template>
	<view class="container">
		<view class="header-box">
			<view class="img-box">
				<img :src="nearestHospitalObj.imageList[0]" alt="">
			</view>
			<view class="text-box">
				<view>{{nearestHospitalObj.storeName}}</view>
				<view style="display: flex;justify-content: space-between;font-size: 24rpx;color: #666;">
					<text>{{nearestHospitalObj.address}}</text>
					<text v-if='nearestHospitalObj.distance'>{{nearestHospitalObj.distance}}</text>
				</view>
			</view>
		</view>
		<div class="make-an-appointment">

			<view style="font-size: 32rpx; font-weight: 600;padding: 20rpx 0;" v-if='followList.length>0'>最新关注</view>

			<view class="list-content">
				<view class="content-box" v-for="item in followList" :key="item.userId"
					@click="branchCourtListClick(item)">
					<view class="img-box">
						<img :src="item.image?item.image:baseURL+'/static/error.png'" alt="" />
					</view>
					<view class="right-content-box">
						<view class="h-title">
							<view style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;"><text
									style="font-weight: 600;">{{item.doctorName}}</text> <text
									style="font-size: 24rpx;margin-left: 10rpx;">{{item.departmentName}}</text>
							</view>
							<!-- <view class="physician-box">预约</view> -->
						</view>

						<view class="p-text">
							<view> 好评：<text style="color:#FE8C22">{{item.esteemRate*100}}%</text></view>
							<view>接诊人次：<text style="color:#2E75E8">{{item.receptionNum}}人</text></view>
						</view>
					</view>
				</view>
			</view>
			<view style="font-size: 32rpx; font-weight: 600;padding-bottom: 20rpx;padding-top: 20rpx;">精选医生</view>
			<view class="dept-list">
				<view class="dept-item" v-for='item in deptArr' :key='item.value'
					:class="[item.value===deptValue?'active':'']" @click="deptMethod(item)">{{item.name}}</view>
			</view>
			<view class="list-content">
				<view class="content-box" v-for="winnow in winnowList" :key="winnow.doctorId"
					@click="winnowListClick(winnow)">
					<view class="img-box">
						<img :src="winnow.image?winnow.image:baseURL+'/static/error.png'" alt="" />
					</view>

					<view class="right-content-box">
						<view class="h-title">
							<view style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;"><text
									style="font-weight: 600;">{{winnow.doctorName}}</text> <text
									style="font-size: 24rpx;margin-left: 10rpx">{{winnow.departmentName}}</text>
							</view>
							<!-- <view class="physician-box">预约</view> -->
						</view>
						<view class="p-text">
							<view> 好评：<text style="color:#FE8C22">{{winnow.esteemRate*100}}%</text></view>
							<view>接诊人次：<text style="color:#2E75E8">{{winnow.receptionNum}}人</text></view>
						</view>
					</view>
				</view>
			</view>
		</div>
	</view>
</template>

<script>
	import {
		myFollow,
		winnowDoctor,
		nearestHospital,
		deptList
	} from "@/api/axios/PhysicianManagement.js";
	import store from "@/store/index.js"
	export default {
		data() {
			return {
				followList: [],
				winnowList: [],
				show: false,
				columns: [],
				baseURL: this.staticURL,
				nearestHospitalObj: {},
				deptArr: [],
				deptValue: ''
			};
		},
		onShow: async function() {
			let openId = uni.getStorageSync("openId")
			deptList().then(res => {
				this.deptArr = [{
					name: '全部',
					value: ''
				}, ...res]
			})
			let list = await myFollow({
				params: {
					openId
				}
			})
			this.followList = list?.length > 0 ? list : []
			let winnowList = await winnowDoctor({
				params: {
					openId,
					pageNo: 1,
					pageSize: 9999
				}
			})
			this.winnowList = winnowList.records;

			let mapData = uni.getStorageSync('mapData')
			let nearestHospitalObj = await nearestHospital({
				params: {
					localCoordinate: mapData,
					mode: 'driving'
				}
			})
			if (nearestHospitalObj.images) {
				nearestHospitalObj.image = nearestHospitalObj.images.split(',')[0]
			}
			this.nearestHospitalObj = nearestHospitalObj


		},
		methods: {
			deptMethod(dept) {
				let openId = uni.getStorageSync("openId")
				this.deptValue = dept.value
				winnowDoctor({
					params: {
						openId,
						pageNo: 1,
						departmentId: dept.value,
						pageSize: 9999
					}
				}).then(winnowList => {
					this.winnowList = winnowList.records;
				})

			},
			branchCourtListClick(data) {
				console.log(data, 'data');
				uni.navigateTo({
					url: "/pages-makeAnAppointmentCenter/BranchCourtDetail/index?doctorId=" +
						data.userId + '&storeId=' + data.departmentId,
				})
			},
			winnowListClick(data) {
				console.log(data);
				uni.navigateTo({
					url: "/pages-makeAnAppointmentCenter/BranchCourtDetail/index?doctorId=" +
						data.doctorId + '&storeId=' + data.departmentId,
				})
			}
		},
	};
</script>

<style lang="scss">
	@import "index.scss";
</style>